<template>
	<view class="bg min100">
		<!-- <u-sticky h5-nav-height="0">
			<view class="status_bar bg-blue">
			</view>
			
			<view class="bg-blue white">
				<view class="center pd-20">
					<view class="size-34 mr-10">订单详情</view>
				</view>
			</view>
		</u-sticky> -->
		<view class="cu-custom" :style="{height: $wanlshop.wanlsys().height + 'px' }">
			<view class="cu-bar fixed" :style="{
				height: $wanlshop.wanlsys().height + 'px', 
				paddingTop: $wanlshop.wanlsys().top + 'px',
				color: '#333333',
				backgroundColor: '#fff',
			}">
				<view class="action" @tap="$wanlshop.on('/pages/index')">
					<text class="wlIcon-fanhui1"></text>
				</view>
				<view class="content text-bold" :style="{top: $wanlshop.wanlsys().top + 'px'}">
					订单
				</view>
				<view class="action" @tap="$wanlshop.on('/pages/index')">
					<text class="iconfont icon-ipr_shouye text-bold" style="font-size: 44rpx;"></text>
				</view>
			</view>
		</view>
		<view class="pd-30">
			<wanl-empty v-if="!list||list.length==0" text="暂无订单"></wanl-empty>
			<view v-for="(item,i) in list" :key="i" class="mb-30">
			
				<sfItem @update="change(current)" v-if="current==0" :type="2" :item="item"></sfItem>
				<hyItem v-if="current==2" type="2" :item="item"></hyItem>
			</view>
			<u-loadmore v-show="list&&list.length>9" :status="status" icon-type="flower" bg-color="transperant" margin-top="30"
			 margin-bottom="30" />
		</view>
		<u-tabbar v-model="currentTab" :list="listTab" active-color="#120062" @change="jump"></u-tabbar>
	</view>
</template>

<script>
	import {
		mapState
	} from 'vuex'
	import sfItem from '@/components/sf-item.vue'
	import hyItem from '@/components/huoyun/hy-item.vue'
	export default {
		data() {
			return {
				index:1,
				current: '',
				timer3: null,
				page: 1,
				status: 'loadmore',
				list: [],
				currentTab: 0, // 底部
				listTab: [ {
						"pagePath": "/pages/driver/order/index",
						"iconPath": "/static/tabbar/2.png",
						"selectedIconPath": "/static/tabbar/2-2.png",
						"text": "订单"
					}, {
						"pagePath": "/pages/driver/message/index",
						"iconPath": "/static/tabbar/5.png",
						"selectedIconPath": "/static/tabbar/5-1.png",
						"text": "消息"
					},
					{
						"pagePath": "/pages/driver/my/index",
						"iconPath": "/static/tabbar/3.png",
						"selectedIconPath": "/static/tabbar/3-3.png",
						"text": "我的"
					}
				], // 底部
			}
		},
		computed: {
			...mapState(['tabList'])
		},
		onShow() {
			// this.timer3 = setInterval(()=>{
			// 	if(this.tabList&&this.tabList[0]){
			// 		if(!this.current){
			// 			this.current = this.tabList[0].id
			// 		}
			// 		this.page = 1
			// 		this.list = []
			// 		this.status = 'loadmore'
			// 		if (this.current == 0) {
			// 			this.getList1()
			// 		} else if (this.current == 1) {
			// 			this.getList2()
			// 		}else if (this.current == 2) {
			// 			this.getList3()
			// 		}
			// 		clearInterval(this.timer3)
			// 		this.timer3 = null
			// 	}
			// },200)
			this.getList1()
		},
		onUnload() {
			clearInterval(this.timer3)
		},
		onHide() {
			clearInterval(this.timer3)
		},
		onPullDownRefresh() {
			this.page = 1
			this.list = []
			if (this.current == 0) {
				this.getList1()
			} else if (this.current == 1) {
				this.getList2()
			}else if (this.current == 2) {
				this.getList3()
			}
		},
		onReachBottom() {
			//避免多次触发
			if (this.status == 'loading' || this.status == 'nomore') {
				return;
			}
			if (this.current == 0) {
				this.getList1()
			} else if (this.current == 1) {
				this.getList2()
			}else if (this.current == 2) {
				this.getList3()
			}
		},
		methods: {
			jump(e){
				console.log(e)
				uni.navigateTo({
					url:this.listTab[e].pagePath
				})
			},
			change(index) {
				this.index = index;
				this.current = this.tabList[index].id;
				this.page = 1
				this.list = []
				this.status = 'loadmore'
				if (this.current == 0) {
					this.getList1()
				} else if (this.current == 1) {
					this.getList2()
				}else if (this.current == 2) {
					this.getList3()
				}
			},
			getList1() {
				this.$http('/addons/ddrive/order/order_info', {
					order_type: 1,
				}, "POST").then(res => {
					this.list = res.data
					uni.stopPullDownRefresh();
				})
			},
			getList2() {
				this.status = "loading"
				this.$http('/addons/ddrive/order/order_info',{
          order_type: 1,
				}, "POST").then(res => {
					// let data = res
					// if (data.length < 10) {
					// 	this.status = "nomore"
					// } else {
					// 	this.page = this.page + 1
					// 	this.status = "loadmore"
					// }
					// this.list = this.list.concat(data)
          this.list = res.data
          console.log('顺风车',this.list)
					uni.stopPullDownRefresh();
				})
			},
			getList3() {
				this.status = "loading"
				this.$http('/addons/ddrive/hyorder/order_list',{
					page:this.page,
					type:1
				}).then(res => {
					let data = res.data
					if (data.length < 10) {
						this.status = "nomore"
					} else {
						this.page = this.page + 1
						this.status = "loadmore"
					}
					this.list = this.list.concat(data)
					uni.stopPullDownRefresh();
				})
			},
		}
	}
</script>

<style scoped lang="scss">

</style>
